import React from 'react';
import { Row, Col, Empty, Button } from 'antd';
import styled from 'styled-components';
import MainLayout from '../../components/Layout/MainLayout';
import { useNavigate } from 'react-router-dom';

const PageContainer = styled.div`
  padding: 20px 0;
`;

const FavoritesPage: React.FC = () => {
  const navigate = useNavigate();
  
  return (
    <MainLayout>
      <PageContainer className="container">
        <Row justify="center" align="middle" style={{ minHeight: '300px' }}>
          <Col>
            <Empty
              description="您还没有收藏任何酒店"
              image={Empty.PRESENTED_IMAGE_SIMPLE}
            />
            <div style={{ textAlign: 'center', marginTop: '20px' }}>
              <Button type="primary" onClick={() => navigate('/')}>
                去浏览酒店
              </Button>
            </div>
          </Col>
        </Row>
      </PageContainer>
    </MainLayout>
  );
};

export default FavoritesPage; 